♿ Aria: [UX improvement] Accessible Canvas Focus & Live Region#1193
Conversation
…anvas - Adds `aria-label`, `role="img"`, `tabindex="0"`, and `aria-describedby` to `#glCanvas` - Adds a visually hidden live region (`#world-status`) to announce map generation progress - Binds world generation updates to `#world-status` in `main.ts` - Adds pastel pink `:focus-visible` ring to `#glCanvas` for keyboard users Co-authored-by: ford442 <9397845+ford442@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
|
Warning Review limit reached
More reviews will be available in 13 minutes and 38 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more credits in the billing tab to continue. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (3)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
1 participant
This PR implements accessibility improvements to the core WebGPU canvas in Candy World to make it more inclusive for screen reader and keyboard users:
aria-live="polite"region has been added (#world-status) that announces loading and world population progress dynamically. The canvas links to this usingaria-describedby.<canvas>element now hastabindex="0"and a descriptivearia-labeldetailing the immersive candy landscape.#glCanvas:focus-visible) has been added using CSSoutlineandbox-shadowfor keyboard users, avoiding the default browser styles while preventing focus outlines on mouse clicks.PR created automatically by Jules for task 15153437265108453141 started by @ford442